<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    
    
<!DOCTYPE>
<html>
	<head>
		<meta charset="UTF-8">
		<title>首页</title>
		
		<!--引入jquery-->
		<script src="${pageContext.request.contextPath}/js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
		<!--引入bootsrap-->
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/bootstrap.css"/>
		<script src="${pageContext.request.contextPath}/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
		
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/user/index.css"/>
	
	
		
	
	</head>
	<body>
		
		<!--导航条-->
		<jsp:include page="/user/header.jsp"></jsp:include>
		
		<!--轮播图-->		
		<div id="carousel-example-generic" class="carousel slide container ad" data-ride="carousel">
		  <ol class="carousel-indicators">
		    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
		    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
		    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
		  </ol>

		  <div class="carousel-inner" role="listbox">
		    <div class="item active">
		      <img src="${pageContext.request.contextPath}/img/ad/banner4.jpeg" alt="${pageContext.request.contextPath}.">
		    </div>
		    <div class="item">
		      <img src="${pageContext.request.contextPath}/img/ad/banner4.jpeg" alt="${pageContext.request.contextPath}.">
		    </div>
		    <div class="item">
		      <img src="${pageContext.request.contextPath}/img/ad/banner4.jpeg" alt="${pageContext.request.contextPath}.">
		    </div>
		  </div>

		  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
		    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
		    <span class="sr-only">Previous</span>
		  </a>
		  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
		    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
		    <span class="sr-only">Next</span>
		  </a>
		</div>
			
		<!--可预订房间-->	
		<div class="container main">
			<div class="col-md-12">
				<h2>可预订房间&nbsp;&nbsp;<img src="${pageContext.request.contextPath}/img/user/remen.jpg"/></h2>
			</div>
			
			<div class="col-md-12">	
				<c:forEach var="hotRoom" items="${hotRooms }">					
					
					<div class="col-md-4 rmitem">
						<a href="${pageContext.request.contextPath }/RoomServlet?action=ui&rid=${hotRoom.roomId }">
							<img src="/img/${hotRoom.rImg }">
						</a>
						<p><a href="${pageContext.request.contextPath }/RoomServlet?action=ui&rid=${hotRoom.roomId }" >
								${hotRoom.rName }</a></p>
						<p class="price">&yen;${hotRoom.rPrice }</p>					
					</div>
										
				</c:forEach>								
			</div>
		</div>	
			
		<!--foot-->		
		<!-- 
			jsp:include: jsp动作，作用是引入一个其他的页面
			    page：引入页面的地址，/表示web应用根路径
		 -->		
		<jsp:include page="/user/footer.jsp"></jsp:include>
						
	</body>
</html>
